const path = require('path')
const webpack = require('webpack')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const dotenv = require('dotenv')
const devEnv = process.env.NODE_ENV !== 'production';
const mode = process.env.mode || process.env.NODE_ENV
let result = {}
const commonConfig = dotenv.config()
const envConfig = dotenv.config({ path: path.resolve(__dirname, `${mode}.env`) })
if (!commonConfig.error) {
    result = Object.assign(result, commonConfig.parsed)
}
if (!envConfig.error) {
    result = Object.assign(result, envConfig.parsed)
}

// const HappyPack = require('happypack')
// const os = require('os')
// const happyThreadPool = HappyPack.ThreadPool({
//     size: os.cpus().length
// })
/**
 * @type { import('webpack').Configuration }
 */
module.exports = {
    entry: {
        app: './src/main.js'
    },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'js/[name].js',
        chunkFilename: 'js/[name].js',
        publicPath: '/',
    },
    module: {
        rules: [
            {
                enforce: 'pre',
                test: /\.(js|vue)$/,
                loader: 'eslint-loader',
                exclude: /node_modules/,
                options: {
                    formatter: require('eslint-friendly-formatter'),
                    emitWarning: true
                }
            },
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            },
            {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: /node_modules/,
            },
            {
                test: /\.css$/,
                use: [
                    devEnv ? 'vue-style-loader' : MiniCssExtractPlugin.loader,
                    'css-loader',
                    'postcss-loader'
                ]
            },
            {
                test: /\.less$/,
                use: [
                    devEnv ? 'vue-style-loader' : MiniCssExtractPlugin.loader,
                    'css-loader',
                    'postcss-loader',
                    'less-loader'
                ]
            },
            {
                test: /\.(png|jpe?g|fig|svg)$/,
                loader: 'url-loader',
                options: {
                    esModule: false,
                    limit: 6 * 1024,
                    name: 'img/[name].[contenthash:6].[ext]'
                }
            },
            {
                test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)$/,
                loader: 'url-loader',
                options: {
                    esModule: false,
                    limit: 6 * 1024,
                    name: 'media/[name].[contenthash:6].[ext]'
                }
            },
            {
                test: /\.(woff2?|eot|ttf|otf)$/,
                loader: 'url-loader',
                options: {
                    esModule: false,
                    limit: 6 * 1024,
                    name: 'font/[name].[contenthash:6].[ext]'
                }
            }
        ]
    },
    resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
            'vue$': 'vue/dist/vue.esm.js',
            '@': path.resolve(__dirname, './src/')
        }
    },
    plugins: [
        new VueLoaderPlugin(),
        new HtmlWebpackPlugin({
            template: 'public/index.html',
            filename: 'index.html',
            title: 'vue-app-base'
        }),
        new webpack.DefinePlugin({
            'BASE_URL': '"/"',
            'process.env': JSON.stringify(result)
        }),
        // new HappyPack({
        //     id: 'js',
        //     threadPool: happyThreadPool,
        //     loaders: ['babel-loader']
        // }),
    ]
}